<script setup lang="ts">
const { setLoading } = useStatusStore();
const { id } = useRoute().params;

setLoading(true);
const { data: post } = await useAsyncData(`post-detail-${id}`, () =>
  $get<Post>(`/posts/${id}`)
);

if (!(post && post.value)) {
  throw createError({ statusCode: 404, statusMessage: "No post found" });
}
const { data: user } = await useAsyncData(
  `user-detail-${post.value?.userId}`,
  () => $get<User>(`/users/${post.value?.userId}`)
);
setLoading(false);

useSeoMeta({
  title: `博客详情 - ${post?.value.title}`,
});
</script>

<template>
  <PageTitle>博客详情 {{ post?.id }}</PageTitle>
  <h1 class="text-xl">{{ post?.title }}</h1>
  <div class="text-gray-600 text-sm before:content-['@'] before:mr-1 my-6">
    <NuxtLink to="/">{{ user?.name }}</NuxtLink>
  </div>
  <p class="my-6 text-black text-lg">{{ post?.body }}</p>
</template>
